{% extends 'article/base.html' %}
{% load static %}
{% block title %} article list{% endblock %}
{% block content %}
    <div>
        <table class="table table-hover">
            <tr>
                <td>序号</td>
                <td>标题</td>
                <td>栏目</td>
                <td>操作</td>
            </tr>
            {% for article in articles %}
                <tr id={{ article.id }}>
                    <td>{{ forloop.counter }}</td>
                    <td><a href="{{ article.get_url_path }}">{{ article.title }}</a></td>
                    <td>{{ article.column }}</td>
                    <td>
                        <a name="edit" href='{% url "article:redit_article" article.id %}'><span class="glyphicon glyphicon-pencil"> </span></a>
                        <a name="delete" href="javascript:" onclick="del_article(this,{{ article.id }})"><span
                                class="glyphicon glyphicon-trash" style="margin-left:20px;"></span></a>
                    </td>
                </tr>
            {% endfor %}
        </table>
        {% include "paginator.html" %}
    </div>
{% endblock %}
{% block javascript %}
    <script type="text/javascript">
        function del_article(the, article_id) {
            let article_name = $(the).parents("tr").children("td").eq(1).text();
            layer.open({
                type: 1,
                skin: "layui-layer-rim",
                area: ["400px", "200px"],
                title: "删除文章",
                content: '<div class="text-center" style="margin-top:20px"><p>是否确定删除《' + article_name + '》</p></div>',
                btn: ['确定', '取消'],
                yes: function () {
                    $.ajax({
                        url: '{% url "article:del_article" %}',
                        type: "POST",
                        data: {"article_id": article_id},
                        success: function (e) {
                            if (e == "1") {
                                parent.location.reload();
                                layer.msg("has been deleted.");
                            } else {
                                layer.msg('删除失败');
                            }
                        }
                    })
                }
            })
        }
    </script>
{% endblock %}